<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
<meta charset="utf-8">
<title></title>
  <link href="http://www.yanhuangxueyuan.com/markdown.css" rel="stylesheet" type="text/css">
  </head>
  <body>

<h1 id="-">投影矩阵、视图矩阵</h1>
<p>学习本节课之前最好对图形学中视图矩阵和投影矩阵有一定了解，同时对于Three.js的正投影相机<code>OrthographicCamera</code>、透视投影相机<code>PerspectiveCamera</code>有一定了解。</p>
<p>关键词：投影矩阵、视图矩阵、正投影、透视投影、视点、目标观察点、上方向、正投影相机、透视投影相机</p>
<p>如果你对图形学中视图矩阵、投影矩阵相关内容比较了解有助于本节课的学习，如果不了解的话可以根据关键词去检索一下相关的内容去学习补充。</p>
<h3 id="-matrixworldinverse-projectionmatrix-">相机对象属性<code>.matrixWorldInverse</code>和<code>.projectionMatrix</code></h3>
<p>正投影相机<code>PerspectiveCamera</code>和透视投影相机<code>OrthographicCamera</code>的基类是相机<code>Camera</code>,相机对象<code>Camera</code>具有视图矩阵属性<code>.matrixWorldInverse</code>和投影矩阵属性<code>.projectionMatrix</code>。</p>
<p>相机对象本质就是视图矩阵和投影矩阵，顶点坐标经过平移旋转缩放模型变换以后，还需要经过视图、投影变换才能显示到画布上。</p>
<h3 id="-matrix4-makeorthographic-"><code>Matrix4</code>方法：正投影<code>.makeOrthographic()</code></h3>
<h3>正投影公式：</h3>
<p>
  <?xml version='1.0' encoding='UTF-8'?>
  <!-- This file was generated by dvisvgm 1.15.1 -->
  <svg height='167.975pt' version='1.1' viewBox='-0.239051 -0.228197 582.944 167.975' width='582.944pt' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
  <defs>
  <path d='M8.08058 43.6252H9.79089V0.743612H16.3347V-0.966695H8.08058V43.6252Z' id='g0-50'/>
  <path d='M6.71729 43.6252H8.4276V-0.966695H0.173509V0.743612H6.71729V43.6252Z' id='g0-51'/>
  <path d='M8.08058 43.6004H16.3347V41.8901H9.79089V-0.991482H8.08058V43.6004Z' id='g0-52'/>
  <path d='M6.71729 41.8901H0.173509V43.6004H8.4276V-0.991482H6.71729V41.8901Z' id='g0-53'/>
  <path d='M8.08058 14.897H9.79089V-0.0247871H8.08058V14.897Z' id='g0-54'/>
  <path d='M6.71729 14.897H8.4276V-0.0247871H6.71729V14.897Z' id='g0-55'/>
  <use id='g5-48' transform='scale(1.19961)' xlink:href='#g4-48'/>
  <use id='g5-49' transform='scale(1.19961)' xlink:href='#g4-49'/>
  <use id='g2-0' transform='scale(1.19961)' xlink:href='#g1-0'/>
  <path d='M6.21942 -2.45884C6.11611 -2.10758 6.11611 -2.06625 5.82683 -1.67366C5.37226 -1.09511 4.4631 -0.206625 3.49197 -0.206625C2.6448 -0.206625 2.16956 -0.971138 2.16956 -2.19023C2.16956 -3.32667 2.8101 -5.64087 3.20269 -6.50869C3.90522 -7.95507 4.87635 -8.69892 5.68219 -8.69892C7.04592 -8.69892 7.31453 -7.00459 7.31453 -6.83929C7.31453 -6.81863 7.25254 -6.55002 7.23188 -6.50869L6.21942 -2.45884ZM7.54182 -7.74845C7.31453 -8.28567 6.75664 -9.11217 5.68219 -9.11217C3.34733 -9.11217 0.826501 -6.09544 0.826501 -3.03739C0.826501 -0.991801 2.02493 0.206625 3.42998 0.206625C4.56642 0.206625 5.53756 -0.681863 6.11611 -1.36373C6.32273 -0.144638 7.29387 0.206625 7.91375 0.206625S9.02952 -0.1653 9.40145 -0.909151C9.73205 -1.61168 10.0213 -2.87209 10.0213 -2.95474C10.0213 -3.05805 9.93867 -3.1407 9.8147 -3.1407C9.62873 -3.1407 9.60807 -3.03739 9.52542 -2.72745C9.21548 -1.50836 8.8229 -0.206625 7.97573 -0.206625C7.37652 -0.206625 7.33519 -0.743851 7.33519 -1.1571C7.33519 -1.63234 7.39718 -1.85963 7.58315 -2.66547C7.72778 -3.18203 7.8311 -3.6366 7.9964 -4.23582C8.76091 -7.33519 8.94687 -8.07905 8.94687 -8.20302C8.94687 -8.4923 8.71958 -8.71958 8.40965 -8.71958C7.74845 -8.71958 7.58315 -7.9964 7.54182 -7.74845Z' id='g3-97'/>
  <path d='M4.77304 -13.8232C4.7937 -13.9059 4.83503 -14.0299 4.83503 -14.1332C4.83503 -14.3398 4.6284 -14.3398 4.58708 -14.3398C4.56642 -14.3398 3.82257 -14.2778 3.45064 -14.2365C3.09938 -14.2158 2.78944 -14.1745 2.41751 -14.1538C1.92161 -14.1125 1.77698 -14.0918 1.77698 -13.7199C1.77698 -13.5133 1.9836 -13.5133 2.19023 -13.5133C3.24402 -13.5133 3.24402 -13.3273 3.24402 -13.1207C3.24402 -12.9761 3.07872 -12.3769 2.99607 -12.0049L2.50017 -10.0213C2.29354 -9.19482 1.11578 -4.50443 1.03313 -4.1325C0.929813 -3.61594 0.929813 -3.26468 0.929813 -2.99607C0.929813 -0.888488 2.10758 0.206625 3.45064 0.206625C5.84749 0.206625 8.327 -2.87209 8.327 -5.86816C8.327 -7.76911 7.25254 -9.11217 5.70286 -9.11217C4.6284 -9.11217 3.65727 -8.22368 3.26468 -7.81043L4.77304 -13.8232ZM3.4713 -0.206625C2.8101 -0.206625 2.08691 -0.702526 2.08691 -2.3142C2.08691 -2.99607 2.1489 -3.38865 2.52083 -4.83503C2.58282 -5.10364 2.91342 -6.42604 2.99607 -6.69466C3.03739 -6.85996 4.25648 -8.69892 5.66153 -8.69892C6.57068 -8.69892 6.98393 -7.78977 6.98393 -6.71532C6.98393 -5.72352 6.40538 -3.38865 5.88882 -2.3142C5.37226 -1.19843 4.42178 -0.206625 3.4713 -0.206625Z' id='g3-98'/>
  <path d='M3.69859 -4.7937C4.25648 -4.7937 5.66153 -4.83503 6.65333 -5.20696C8.22368 -5.80617 8.36832 -7.00459 8.36832 -7.37652C8.36832 -8.28567 7.58315 -9.11217 6.21942 -9.11217C4.04985 -9.11217 0.929813 -7.14923 0.929813 -3.4713C0.929813 -1.30174 2.16956 0.206625 4.04985 0.206625C6.85996 0.206625 8.63693 -1.9836 8.63693 -2.25221C8.63693 -2.37619 8.51296 -2.4795 8.43031 -2.4795C8.36832 -2.4795 8.34766 -2.45884 8.1617 -2.27288C6.83929 -0.516563 4.87635 -0.206625 4.09118 -0.206625C2.91342 -0.206625 2.29354 -1.13644 2.29354 -2.66547C2.29354 -2.95474 2.29354 -3.4713 2.60348 -4.7937H3.69859ZM2.70679 -5.20696C3.59528 -8.38898 5.55822 -8.69892 6.21942 -8.69892C7.12857 -8.69892 7.74845 -8.1617 7.74845 -7.37652C7.74845 -5.20696 4.44244 -5.20696 3.57462 -5.20696H2.70679Z' id='g3-101'/>
  <path d='M9.21548 -8.30633C9.62873 -8.30633 9.79403 -8.30633 9.79403 -8.69892C9.79403 -8.90555 9.62873 -8.90555 9.25681 -8.90555H7.58315C7.97573 -11.0338 8.26501 -12.5008 8.43031 -13.162C8.55428 -13.6579 8.9882 -14.1332 9.52542 -14.1332C9.95934 -14.1332 10.3932 -13.9472 10.5999 -13.7612C9.79403 -13.6786 9.54608 -13.0794 9.54608 -12.7281C9.54608 -12.3149 9.85602 -12.0669 10.2486 -12.0669C10.6619 -12.0669 11.2817 -12.4182 11.2817 -13.2034C11.2817 -14.0712 10.4139 -14.5464 9.50476 -14.5464C8.61627 -14.5464 7.74845 -13.8852 7.33519 -13.0794C6.96327 -12.3562 6.75664 -11.6123 6.28141 -8.90555h3.89702C4.50443 -8.90555 4.2978 -8.90555 4.2978 -8.53362C4.2978 -8.30633 4.42178 -8.30633 4.83503 -8.30633H6.15743C5.78551 -6.38472 4.93834 -1.71499 4.4631 0.495901C4.11184 2.29354 3.8019 3.8019 2.76878 3.8019C2.70679 3.8019 2.10758 3.8019 1.73565 3.40932C2.78944 3.32667 2.78944 2.41751 2.78944 2.39685C2.78944 1.9836 2.4795 1.73565 2.08691 1.73565C1.67366 1.73565 1.05379 2.08691 1.05379 2.87209C1.05379 3.76058 1.96294 4.21515 2.76878 4.21515C4.87635 4.21515 5.74418 0.433913 5.97147 -0.599213C6.34339 -2.19023 7.35586 -7.68646 7.45917 -8.30633H9.21548Z' id='g3-102'/>
  <path d='M6.98393 -2.62414C6.90128 -2.29354 6.85996 -2.21089 6.59134 -1.90095C5.74418 -0.805838 4.87635 -0.41325 4.23582 -0.41325C3.55395 -0.41325 2.91342 -0.950476 2.91342 -2.37619C2.91342 -3.4713 3.53329 -5.78551 3.98787 -6.71532C4.58708 -7.87242 5.51689 -8.69892 6.38472 -8.69892C7.74845 -8.69892 8.01706 -7.00459 8.01706 -6.88062L7.95507 -6.59134L6.98393 -2.62414ZM8.26501 -7.74845C7.9964 -8.34766 7.41785 -9.11217 6.38472 -9.11217C4.1325 -9.11217 1.57035 -6.28141 1.57035 -3.20269C1.57035 -1.05379 2.87209 0 4.19449 0C5.28961 0 6.26074 -0.867826 6.63267 -1.28108L6.17809 0.578551C5.88882 1.71499 5.76484 2.23155 5.02099 2.95474C4.17383 3.8019 3.38865 3.8019 2.93408 3.8019C2.3142 3.8019 1.79764 3.76058 1.28108 3.59528C1.94228 3.40932 2.10758 2.83077 2.10758 2.60348C2.10758 2.27288 1.85963 1.94228 1.40505 1.94228C0.909151 1.94228 0.371925 2.35553 0.371925 3.03739C0.371925 3.88455 1.21909 4.21515 2.9754 4.21515C5.64087 4.21515 7.02526 2.50017 7.29387 1.38439L9.58741 -7.87242C9.6494 -8.12037 9.6494 -8.1617 9.6494 -8.20302C9.6494 -8.4923 9.42211 -8.71958 9.11217 -8.71958C8.61627 -8.71958 8.327 -8.30633 8.26501 -7.74845Z' id='g3-103'/>
  <path d='M5.80617 -13.8232C5.82683 -13.9059 5.86816 -14.0299 5.86816 -14.1332C5.86816 -14.3398 5.66153 -14.3398 5.62021 -14.3398C5.59954 -14.3398 4.58708 -14.2571 4.48377 -14.2365C4.1325 -14.2158 3.82257 -14.1745 3.45064 -14.1538C2.93408 -14.1125 2.78944 -14.0918 2.78944 -13.7199C2.78944 -13.5133 2.95474 -13.5133 3.24402 -13.5133C4.25648 -13.5133 4.27714 -13.3273 4.27714 -13.1207C4.27714 -12.9967 4.23582 -12.8314 4.21515 -12.7694L1.21909 -0.805838C1.13644 -0.495901 1.13644 -0.454575 1.13644 -0.3306C1.13644 0.123975 1.4877 0.206625 1.69433 0.206625C2.04559 0.206625 2.3142 -0.0619876 2.41751 -0.289275L3.34733 -4.02919C3.45064 -4.48377 3.57462 -4.91768 3.67793 -5.37226C3.90522 -6.24008 3.90522 -6.26074 4.2978 -6.85996S5.62021 -8.69892 7.21122 -8.69892C8.03772 -8.69892 8.327 -8.07905 8.327 -7.25254C8.327 -6.09544 7.52116 -3.84323 7.06658 -2.60348C6.88062 -2.10758 6.77731 -1.83896 6.77731 -1.46704C6.77731 -0.537226 7.41785 0.206625 8.40965 0.206625C10.3313 0.206625 11.0544 -2.83077 11.0544 -2.95474C11.0544 -3.05805 10.9718 -3.1407 10.8478 -3.1407C10.6619 -3.1407 10.6412 -3.07872 10.5379 -2.72745C10.0626 -1.07445 9.29813 -0.206625 8.47163 -0.206625C8.26501 -0.206625 7.93441 -0.227288 7.93441 -0.888488C7.93441 -1.42571 8.18236 -2.08691 8.26501 -2.3142C8.63693 -3.306 9.56675 -5.74418 9.56675 -6.94261C9.56675 -8.18236 8.84356 -9.11217 7.27321 -9.11217C6.09544 -9.11217 5.06232 -8.55428 4.21515 -7.47983L5.80617 -13.8232Z' id='g3-104'/>
  <path d='M5.84749 -2.95474C5.84749 -3.05805 5.76484 -3.1407 5.64087 -3.1407C5.45491 -3.1407 5.43424 -3.07872 5.33093 -2.72745C4.7937 -0.847163 3.94654 -0.206625 3.26468 -0.206625C3.01673 -0.206625 2.72745 -0.268613 2.72745 -0.888488C2.72745 -1.44638 2.9754 -2.06625 3.20269 -2.68613L4.64907 -6.52936C4.71105 -6.69466 4.85569 -7.06658 4.85569 -7.45917C4.85569 -8.327 4.23582 -9.11217 3.22335 -9.11217C1.3224 -9.11217 0.557888 -6.11611 0.557888 -5.95081C0.557888 -5.86816 0.640538 -5.76484 0.785176 -5.76484C0.971138 -5.76484 0.991801 -5.84749 1.07445 -6.13677C1.57035 -7.87242 2.35553 -8.69892 3.16137 -8.69892C3.34733 -8.69892 3.69859 -8.67826 3.69859 -8.01706C3.69859 -7.47983 3.42998 -6.79797 3.26468 -6.34339L1.8183 -2.50017C1.69433 -2.16956 1.57035 -1.83896 1.57035 -1.46704C1.57035 -0.537226 2.21089 0.206625 3.20269 0.206625C5.10364 0.206625 5.84749 -2.8101 5.84749 -2.95474ZM5.68219 -12.8934C5.68219 -13.2034 5.43424 -13.5753 4.97967 -13.5753C4.50443 -13.5753 3.9672 -13.1207 3.9672 -12.5835C3.9672 -12.0669 4.40112 -11.9016 4.64907 -11.9016C5.20696 -11.9016 5.68219 -12.4388 5.68219 -12.8934Z' id='g3-105'/>
  <path d='M5.24828 -13.8232C5.26894 -13.9059 5.31027 -14.0299 5.31027 -14.1332C5.31027 -14.3398 5.10364 -14.3398 5.06232 -14.3398C5.04166 -14.3398 4.2978 -14.2778 3.92588 -14.2365C3.57462 -14.2158 3.26468 -14.1745 2.89275 -14.1538C2.39685 -14.1125 2.25221 -14.0918 2.25221 -13.7199C2.25221 -13.5133 2.45884 -13.5133 2.66547 -13.5133C3.71925 -13.5133 3.71925 -13.3273 3.71925 -13.1207C3.71925 -13.0381 3.71925 -12.9967 3.61594 -12.6248L1.05379 -2.37619C0.991801 -2.1489 0.950476 -1.9836 0.950476 -1.653C0.950476 -0.619876 1.71499 0.206625 2.76878 0.206625C3.45064 0.206625 3.90522 -0.24795 4.23582 -0.888488C4.58708 -1.57035 4.87635 -2.87209 4.87635 -2.95474C4.87635 -3.05805 4.7937 -3.1407 4.66973 -3.1407C4.48377 -3.1407 4.4631 -3.03739 4.38045 -2.72745C4.00853 -1.30174 3.6366 -0.206625 2.8101 -0.206625C2.19023 -0.206625 2.19023 -0.867826 2.19023 -1.1571C2.19023 -1.23975 2.19023 -1.67366 2.33486 -2.25221L5.24828 -13.8232Z' id='g3-108'/>
  <path d='M4.25648 -6.05412C4.2978 -6.17809 4.81437 -7.21122 5.57888 -7.87242C6.11611 -8.36832 6.81863 -8.69892 7.62447 -8.69892C8.45097 -8.69892 8.74025 -8.07905 8.74025 -7.25254C8.74025 -7.12857 8.74025 -6.71532 8.4923 -5.74418L7.97573 -3.61594C7.81043 -2.99607 7.41785 -1.46704 7.37652 -1.23975C7.29387 -0.929813 7.16989 -0.392588 7.16989 -0.309938C7.16989 -0.0206625 7.39718 0.206625 7.70712 0.206625C8.327 0.206625 8.43031 -0.268613 8.61627 -1.01246L9.85602 -5.95081C9.89735 -6.11611 10.9718 -8.69892 13.2447 -8.69892C14.0712 -8.69892 14.3605 -8.07905 14.3605 -7.25254C14.3605 -6.09544 13.5546 -3.84323 13.1 -2.60348C12.9141 -2.10758 12.8108 -1.83896 12.8108 -1.46704C12.8108 -0.537226 13.4513 0.206625 14.4431 0.206625C16.3647 0.206625 17.0879 -2.83077 17.0879 -2.95474C17.0879 -3.05805 17.0053 -3.1407 16.8813 -3.1407C16.6953 -3.1407 16.6747 -3.07872 16.5713 -2.72745C16.0961 -1.07445 15.3316 -0.206625 14.5051 -0.206625C14.2985 -0.206625 13.9679 -0.227288 13.9679 -0.888488C13.9679 -1.42571 14.2158 -2.08691 14.2985 -2.3142C14.6704 -3.306 15.6002 -5.74418 15.6002 -6.94261C15.6002 -8.18236 14.877 -9.11217 13.3067 -9.11217C11.9223 -9.11217 10.8065 -8.327 9.98 -7.10791C9.91801 -8.22368 9.23615 -9.11217 7.68646 -9.11217C5.84749 -9.11217 4.87635 -7.81043 4.50443 -7.29387C4.44244 -8.47163 3.59528 -9.11217 2.68613 -9.11217C2.08691 -9.11217 1.61168 -8.8229 1.21909 -8.03772C0.847163 -7.29387 0.557888 -6.03346 0.557888 -5.95081S0.640538 -5.76484 0.785176 -5.76484C0.950476 -5.76484 0.971138 -5.78551 1.09511 -6.26074C1.40505 -7.47983 1.79764 -8.69892 2.62414 -8.69892C3.09938 -8.69892 3.26468 -8.36832 3.26468 -7.74845C3.26468 -7.29387 3.05805 -6.48803 2.91342 -5.84749L2.33486 -3.61594C2.25221 -3.22335 2.02493 -2.29354 1.92161 -1.92161C1.77698 -1.38439 1.54969 -0.41325 1.54969 -0.309938C1.54969 -0.0206625 1.77698 0.206625 2.08691 0.206625C2.33486 0.206625 2.62414 0.0826501 2.78944 -0.227288C2.83077 -0.3306 3.01673 -1.05379 3.12004 -1.46704L3.57462 -3.32667L4.25648 -6.05412Z' id='g3-109'/>
  <path d='M4.25648 -6.05412C4.2978 -6.17809 4.81437 -7.21122 5.57888 -7.87242C6.11611 -8.36832 6.81863 -8.69892 7.62447 -8.69892C8.45097 -8.69892 8.74025 -8.07905 8.74025 -7.25254C8.74025 -6.07478 7.89308 -3.71925 7.47983 -2.60348C7.29387 -2.10758 7.19056 -1.83896 7.19056 -1.46704C7.19056 -0.537226 7.8311 0.206625 8.8229 0.206625C10.7445 0.206625 11.4677 -2.83077 11.4677 -2.95474C11.4677 -3.05805 11.385 -3.1407 11.2611 -3.1407C11.0751 -3.1407 11.0544 -3.07872 10.9511 -2.72745C10.4759 -1.03313 9.69072 -0.206625 8.88488 -0.206625C8.67826 -0.206625 8.34766 -0.227288 8.34766 -0.888488C8.34766 -1.40505 8.57495 -2.02493 8.69892 -2.3142C9.11217 -3.45064 9.98 -5.76484 9.98 -6.94261C9.98 -8.18236 9.25681 -9.11217 7.68646 -9.11217C5.84749 -9.11217 4.87635 -7.81043 4.50443 -7.29387C4.44244 -8.47163 3.59528 -9.11217 2.68613 -9.11217C2.02493 -9.11217 1.57035 -8.71958 1.21909 -8.01706C0.847163 -7.27321 0.557888 -6.03346 0.557888 -5.95081S0.640538 -5.76484 0.785176 -5.76484C0.950476 -5.76484 0.971138 -5.78551 1.09511 -6.26074C1.42571 -7.52116 1.79764 -8.69892 2.62414 -8.69892C3.09938 -8.69892 3.26468 -8.36832 3.26468 -7.74845C3.26468 -7.29387 3.05805 -6.48803 2.91342 -5.84749L2.33486 -3.61594C2.25221 -3.22335 2.02493 -2.29354 1.92161 -1.92161C1.77698 -1.38439 1.54969 -0.41325 1.54969 -0.309938C1.54969 -0.0206625 1.77698 0.206625 2.08691 0.206625C2.33486 0.206625 2.62414 0.0826501 2.78944 -0.227288C2.83077 -0.3306 3.01673 -1.05379 3.12004 -1.46704L3.57462 -3.32667L4.25648 -6.05412Z' id='g3-110'/>
  <path d='M9.42211 -5.68219C9.42211 -7.64513 8.14103 -9.11217 6.26074 -9.11217C3.53329 -9.11217 0.847163 -6.13677 0.847163 -3.22335C0.847163 -1.26041 2.12824 0.206625 4.00853 0.206625C6.75664 0.206625 9.42211 -2.76878 9.42211 -5.68219ZM4.02919 -0.206625C2.99607 -0.206625 2.23155 -1.03313 2.23155 -2.4795C2.23155 -3.42998 2.72745 -5.53756 3.306 -6.57068C4.23582 -8.1617 5.39292 -8.69892 6.24008 -8.69892C7.25254 -8.69892 8.03772 -7.87242 8.03772 -6.42604C8.03772 -5.59954 7.60381 -3.38865 6.81863 -2.12824C5.97147 -0.743851 4.83503 -0.206625 4.02919 -0.206625Z' id='g3-111'/>
  <path d='M0.888488 2.62414C0.743851 3.24402 0.661201 3.40932 -0.185963 3.40932C-0.433913 3.40932 -0.640538 3.40932 -0.640538 3.8019C-0.640538 3.84323 -0.619876 4.00853 -0.392588 4.00853C-0.123975 4.00853 0.1653 3.9672 0.433913 3.9672H1.3224C1.75631 3.9672 2.8101 4.00853 3.24402 4.00853C3.36799 4.00853 3.61594 4.00853 3.61594 3.6366C3.61594 3.40932 3.4713 3.40932 3.12004 3.40932C2.16956 3.40932 2.10758 3.26468 2.10758 3.09938C2.10758 2.85143 3.03739 -0.702526 3.16137 -1.17776C3.38865 -0.599213 3.94654 0.206625 5.02099 0.206625C7.35586 0.206625 9.87669 -2.83077 9.87669 -5.86816C9.87669 -7.76911 8.80223 -9.11217 7.25254 -9.11217C5.93014 -9.11217 4.81437 -7.8311 4.58708 -7.54182C4.42178 -8.57495 3.61594 -9.11217 2.78944 -9.11217C2.19023 -9.11217 1.71499 -8.8229 1.3224 -8.03772C0.950476 -7.29387 0.661201 -6.03346 0.661201 -5.95081S0.743851 -5.76484 0.888488 -5.76484C1.05379 -5.76484 1.07445 -5.78551 1.19843 -6.26074C1.50836 -7.47983 1.90095 -8.69892 2.72745 -8.69892C3.20269 -8.69892 3.36799 -8.36832 3.36799 -7.74845C3.36799 -7.25254 3.306 -7.04592 3.22335 -6.67399L0.888488 2.62414ZM4.4631 -6.44671C4.60774 -7.02526 5.18629 -7.62447 5.51689 -7.91375C5.74418 -8.12037 6.42604 -8.69892 7.21122 -8.69892C8.12037 -8.69892 8.53362 -7.78977 8.53362 -6.71532C8.53362 -5.72352 7.95507 -3.38865 7.43851 -2.3142C6.92194 -1.19843 5.97147 -0.206625 5.02099 -0.206625C3.61594 -0.206625 3.38865 -1.9836 3.38865 -2.06625C3.38865 -2.12824 3.42998 -2.29354 3.45064 -2.39685L4.4631 -6.44671Z' id='g3-112'/>
  <path d='M8.03772 -8.45097C7.39718 -8.327 7.06658 -7.87242 7.06658 -7.41785C7.06658 -6.92194 7.45917 -6.75664 7.74845 -6.75664C8.327 -6.75664 8.80223 -7.25254 8.80223 -7.87242C8.80223 -8.53362 8.1617 -9.11217 7.12857 -9.11217C6.30207 -9.11217 5.35159 -8.74025 4.48377 -7.47983C4.33913 -8.57495 3.51263 -9.11217 2.68613 -9.11217C1.88029 -9.11217 1.46704 -8.4923 1.21909 -8.03772C0.867826 -7.29387 0.557888 -6.05412 0.557888 -5.95081C0.557888 -5.86816 0.640538 -5.76484 0.785176 -5.76484C0.950476 -5.76484 0.971138 -5.78551 1.09511 -6.26074C1.40505 -7.5005 1.79764 -8.69892 2.62414 -8.69892C3.12004 -8.69892 3.26468 -8.34766 3.26468 -7.74845C3.26468 -7.29387 3.05805 -6.48803 2.91342 -5.84749L2.33486 -3.61594C2.25221 -3.22335 2.02493 -2.29354 1.92161 -1.92161C1.77698 -1.38439 1.54969 -0.41325 1.54969 -0.309938C1.54969 -0.0206625 1.77698 0.206625 2.08691 0.206625C2.3142 0.206625 2.70679 0.0619876 2.83077 -0.351263C2.89275 -0.516563 3.65727 -3.6366 3.78124 -4.11184C3.88455 -4.56642 4.00853 -5.00033 4.11184 -5.45491C4.19449 -5.74418 4.27714 -6.07478 4.33913 -6.34339C4.40112 -6.52936 4.95901 -7.54182 5.47557 -7.9964C5.72352 -8.22368 6.26074 -8.69892 7.10791 -8.69892C7.43851 -8.69892 7.76911 -8.63693 8.03772 -8.45097Z' id='g3-114'/>
  <path d='M4.15317 -8.30633H6.05412C6.44671 -8.30633 6.65333 -8.30633 6.65333 -8.67826C6.65333 -8.90555 6.52936 -8.90555 6.11611 -8.90555h3.2978L5.06232 -11.9223C5.14497 -12.2115 5.14497 -12.2529 5.14497 -12.3975C5.14497 -12.7281 4.87635 -12.9141 4.60774 -12.9141C4.44244 -12.9141 3.9672 -12.8521 3.8019 -12.1909L2.99607 -8.90555H1.05379C0.640538 -8.90555 0.454575 -8.90555 0.454575 -8.51296C0.454575 -8.30633 0.599213 -8.30633 0.991801 -8.30633H2.83077L1.46704 -2.85143C1.30174 -2.12824 1.23975 -1.92161 1.23975 -1.653C1.23975 -0.681863 1.92161 0.206625 3.07872 0.206625C5.16563 0.206625 6.28141 -2.8101 6.28141 -2.95474C6.28141 -3.07872 6.19876 -3.1407 6.07478 -3.1407C6.03346 -3.1407 5.95081 -3.1407 5.90948 -3.05805C5.88882 -3.03739 5.86816 -3.01673 5.72352 -2.68613C5.28961 -1.653 4.33913 -0.206625 3.1407 -0.206625C2.52083 -0.206625 2.4795 -0.723188 2.4795 -1.17776C2.4795 -1.19843 2.4795 -1.59101 2.54149 -1.83896L4.15317 -8.30633Z' id='g3-116'/>
  <path d='M7.78977 -4.7937H13.2653C13.5546 -4.7937 13.9059 -4.7937 13.9059 -5.14497C13.9059 -5.51689 13.5753 -5.51689 13.2653 -5.51689H7.78977V-10.9925C7.78977 -11.2817 7.78977 -11.633 7.43851 -11.633C7.06658 -11.633 7.06658 -11.3024 7.06658 -10.9925V-5.51689H1.59101C1.30174 -5.51689 0.950476 -5.51689 0.950476 -5.16563C0.950476 -4.7937 1.28108 -4.7937 1.59101 -4.7937H7.06658V0.681863C7.06658 0.971138 7.06658 1.3224 7.41785 1.3224C7.78977 1.3224 7.78977 0.991801 7.78977 0.681863V-4.7937Z' id='g4-43'/>
  <path d='M8.67826 -6.63267C8.67826 -7.89308 8.6576 -10.042 7.78977 -11.695C7.02526 -13.1414 5.80617 -13.6579 4.73172 -13.6579C3.73992 -13.6579 2.4795 -13.2034 1.69433 -11.7156C0.867826 -10.166 0.785176 -8.24435 0.785176 -6.63267C0.785176 -5.45491 0.805838 -3.65727 1.44638 -2.08691C2.33486 0.041325 3.92588 0.3306 4.73172 0.3306C5.68219 0.3306 7.12857 -0.0619876 7.97573 -2.02493C8.59561 -3.45064 8.67826 -5.12431 8.67826 -6.63267ZM4.73172 0C3.40932 0 2.62414 -1.13644 2.33486 -2.70679C2.10758 -3.92588 2.10758 -5.70286 2.10758 -6.85996C2.10758 -8.45097 2.10758 -9.77337 2.37619 -11.0338C2.76878 -12.7901 3.92588 -13.3273 4.73172 -13.3273C5.57888 -13.3273 6.67399 -12.7694 7.06658 -11.0751C7.33519 -9.89735 7.35586 -8.51296 7.35586 -6.85996C7.35586 -5.51689 7.35586 -3.86389 7.10791 -2.6448C6.67399 -0.392588 5.45491 0 4.73172 0Z' id='g4-48'/>
  <path d='M5.49623 -13.2034C5.49623 -13.6373 5.47557 -13.6579 5.18629 -13.6579C4.38045 -12.6868 3.16137 -12.3769 2.00426 -12.3355C1.94228 -12.3355 1.83896 -12.3355 1.8183 -12.2942S1.79764 -12.2115 1.79764 -11.7776C2.43818 -11.7776 3.51263 -11.9016 4.33913 -12.3975V-1.50836C4.33913 -0.785176 4.2978 -0.537226 2.52083 -0.537226H1.90095V0C2.89275 -0.0206625 3.92588 -0.041325 4.91768 -0.041325S6.94261 -0.0206625 7.93441 0V-0.537226H7.31453C5.53756 -0.537226 5.49623 -0.764513 5.49623 -1.50836V-13.2034Z' id='g4-49'/>
  <path d='M8.61627 -3.20269H8.24435C8.03772 -1.73565 7.87242 -1.4877 7.78977 -1.36373C7.68646 -1.19843 6.19876 -1.19843 5.90948 -1.19843H1.94228C2.68613 -2.00426 4.1325 -3.4713 5.88882 -5.16563C7.14923 -6.36406 8.61627 -7.76911 8.61627 -9.8147C8.61627 -12.2529 6.67399 -13.6579 4.50443 -13.6579C2.23155 -13.6579 0.847163 -11.6537 0.847163 -9.79403C0.847163 -8.9882 1.44638 -8.88488 1.69433 -8.88488C1.90095 -8.88488 2.52083 -9.00886 2.52083 -9.73205C2.52083 -10.3726 1.9836 -10.5585 1.69433 -10.5585C1.57035 -10.5585 1.44638 -10.5379 1.36373 -10.4966C1.75631 -12.2529 2.95474 -13.1207 4.21515 -13.1207C6.01279 -13.1207 7.19056 -11.695 7.19056 -9.8147C7.19056 -8.01706 6.13677 -6.46737 4.95901 -5.12431L0.847163 -0.475238V0H8.12037L8.61627 -3.20269Z' id='g4-50'/>
  <path d='M13.6166 -4.75238C13.9679 -4.75238 14.3398 -4.75238 14.3398 -5.16563S13.9679 -5.57888 13.6166 -5.57888H2.43818C2.08691 -5.57888 1.71499 -5.57888 1.71499 -5.16563S2.08691 -4.75238 2.43818 -4.75238H13.6166Z' id='g1-0'/>
  </defs>
  <g id='page1' transform='matrix(1.13 0 0 1.13 -63.986 -61.0808)'>
  <use x='56.4133' xlink:href='#g0-50' y='54.9332'/>
  <use x='56.4133' xlink:href='#g0-54' y='98.5589'/>
  <use x='56.4133' xlink:href='#g0-54' y='113.431'/>
  <use x='56.4133' xlink:href='#g0-54' y='128.304'/>
  <use x='56.4133' xlink:href='#g0-54' y='143.176'/>
  <use x='56.4133' xlink:href='#g0-52' y='159.04'/>
  <use x='118.084' xlink:href='#g4-50' y='70.0894'/>
  <rect height='0.991445' width='97.3763' x='74.1335' y='73.1563'/>
  <use x='74.1335' xlink:href='#g3-114' y='89.4882'/>
  <use x='83.779' xlink:href='#g3-105' y='89.4882'/>
  <use x='90.6552' xlink:href='#g3-103' y='89.4882'/>
  <use x='101.048' xlink:href='#g3-104' y='89.4882'/>
  <use x='112.651' xlink:href='#g3-116' y='89.4882'/>
  <use x='119.93' xlink:href='#g1-0' y='89.4882'/>
  <use x='135.941' xlink:href='#g3-108' y='89.4882'/>
  <use x='142.399' xlink:href='#g3-101' y='89.4882'/>
  <use x='151.741' xlink:href='#g3-102' y='89.4882'/>
  <use x='163.882' xlink:href='#g3-116' y='89.4882'/>
  <use x='229.99' xlink:href='#g5-48' y='79.8488'/>
  <use x='348.945' xlink:href='#g5-48' y='79.8488'/>
  <use x='423.7' xlink:href='#g2-0' y='79.8488'/>
  <use x='444.701' xlink:href='#g3-114' y='68.1472'/>
  <use x='454.346' xlink:href='#g3-105' y='68.1472'/>
  <use x='461.222' xlink:href='#g3-103' y='68.1472'/>
  <use x='471.615' xlink:href='#g3-104' y='68.1472'/>
  <use x='483.218' xlink:href='#g3-116' y='68.1472'/>
  <use x='490.497' xlink:href='#g4-43' y='68.1472'/>
  <use x='505.315' xlink:href='#g3-108' y='68.1472'/>
  <use x='511.773' xlink:href='#g3-101' y='68.1472'/>
  <use x='521.115' xlink:href='#g3-102' y='68.1472'/>
  <use x='533.257' xlink:href='#g3-116' y='68.1472'/>
  <rect height='0.991445' width='97.3763' x='444.102' y='73.1563'/>
  <use x='444.102' xlink:href='#g3-114' y='89.4882'/>
  <use x='453.747' xlink:href='#g3-105' y='89.4882'/>
  <use x='460.624' xlink:href='#g3-103' y='89.4882'/>
  <use x='471.017' xlink:href='#g3-104' y='89.4882'/>
  <use x='482.62' xlink:href='#g3-116' y='89.4882'/>
  <use x='489.898' xlink:href='#g1-0' y='89.4882'/>
  <use x='505.909' xlink:href='#g3-108' y='89.4882'/>
  <use x='512.367' xlink:href='#g3-101' y='89.4882'/>
  <use x='521.709' xlink:href='#g3-102' y='89.4882'/>
  <use x='533.851' xlink:href='#g3-116' y='89.4882'/>
  <use x='117.138' xlink:href='#g5-48' y='119.556'/>
  <use x='230.935' xlink:href='#g4-50' y='109.797'/>
  <rect height='0.991445' width='103.62' x='183.864' y='112.864'/>
  <use x='183.864' xlink:href='#g3-116' y='129.196'/>
  <use x='191.142' xlink:href='#g3-111' y='129.196'/>
  <use x='200.832' xlink:href='#g3-112' y='129.196'/>
  <use x='210.948' xlink:href='#g1-0' y='129.196'/>
  <use x='226.959' xlink:href='#g3-98' y='129.196'/>
  <use x='235.529' xlink:href='#g3-111' y='129.196'/>
  <use x='245.219' xlink:href='#g3-116' y='129.196'/>
  <use x='252.497' xlink:href='#g3-116' y='129.196'/>
  <use x='259.776' xlink:href='#g3-111' y='129.196'/>
  <use x='269.466' xlink:href='#g3-109' y='129.196'/>
  <use x='348.945' xlink:href='#g5-48' y='119.556'/>
  <use x='420.578' xlink:href='#g2-0' y='119.556'/>
  <use x='441.579' xlink:href='#g3-116' y='107.855'/>
  <use x='448.857' xlink:href='#g3-111' y='107.855'/>
  <use x='458.547' xlink:href='#g3-112' y='107.855'/>
  <use x='468.663' xlink:href='#g4-43' y='107.855'/>
  <use x='483.481' xlink:href='#g3-98' y='107.855'/>
  <use x='492.051' xlink:href='#g3-111' y='107.855'/>
  <use x='501.741' xlink:href='#g3-116' y='107.855'/>
  <use x='509.02' xlink:href='#g3-116' y='107.855'/>
  <use x='516.298' xlink:href='#g3-111' y='107.855'/>
  <use x='525.988' xlink:href='#g3-109' y='107.855'/>
  <rect height='0.991445' width='103.62' x='440.98' y='112.864'/>
  <use x='440.98' xlink:href='#g3-116' y='129.196'/>
  <use x='448.259' xlink:href='#g3-111' y='129.196'/>
  <use x='457.948' xlink:href='#g3-112' y='129.196'/>
  <use x='468.065' xlink:href='#g1-0' y='129.196'/>
  <use x='484.076' xlink:href='#g3-98' y='129.196'/>
  <use x='492.646' xlink:href='#g3-111' y='129.196'/>
  <use x='502.335' xlink:href='#g3-116' y='129.196'/>
  <use x='509.614' xlink:href='#g3-116' y='129.196'/>
  <use x='516.893' xlink:href='#g3-111' y='129.196'/>
  <use x='526.582' xlink:href='#g3-109' y='129.196'/>
  <use x='117.138' xlink:href='#g5-48' y='159.264'/>
  <use x='229.99' xlink:href='#g5-48' y='159.264'/>
  <use x='298.642' xlink:href='#g2-0' y='159.264'/>
  <use x='359.458' xlink:href='#g4-50' y='149.505'/>
  <rect height='0.991445' width='90.3033' x='319.044' y='152.572'/>
  <use x='319.044' xlink:href='#g3-102' y='168.903'/>
  <use x='331.185' xlink:href='#g3-97' y='168.903'/>
  <use x='341.766' xlink:href='#g3-114' y='168.903'/>
  <use x='351.412' xlink:href='#g1-0' y='168.903'/>
  <use x='367.423' xlink:href='#g3-110' y='168.903'/>
  <use x='379.454' xlink:href='#g3-101' y='168.903'/>
  <use x='388.796' xlink:href='#g3-97' y='168.903'/>
  <use x='399.377' xlink:href='#g3-114' y='168.903'/>
  <use x='427.236' xlink:href='#g2-0' y='159.264'/>
  <use x='448.237' xlink:href='#g3-102' y='147.562'/>
  <use x='460.378' xlink:href='#g3-97' y='147.562'/>
  <use x='470.959' xlink:href='#g3-114' y='147.562'/>
  <use x='480.605' xlink:href='#g4-43' y='147.562'/>
  <use x='495.423' xlink:href='#g3-110' y='147.562'/>
  <use x='507.455' xlink:href='#g3-101' y='147.562'/>
  <use x='516.796' xlink:href='#g3-97' y='147.562'/>
  <use x='527.377' xlink:href='#g3-114' y='147.562'/>
  <rect height='0.991445' width='90.3033' x='447.638' y='152.572'/>
  <use x='447.638' xlink:href='#g3-102' y='168.903'/>
  <use x='459.78' xlink:href='#g3-97' y='168.903'/>
  <use x='470.361' xlink:href='#g3-114' y='168.903'/>
  <use x='480.006' xlink:href='#g1-0' y='168.903'/>
  <use x='496.017' xlink:href='#g3-110' y='168.903'/>
  <use x='508.049' xlink:href='#g3-101' y='168.903'/>
  <use x='517.391' xlink:href='#g3-97' y='168.903'/>
  <use x='527.971' xlink:href='#g3-114' y='168.903'/>
  <use x='117.138' xlink:href='#g5-48' y='193.843'/>
  <use x='229.99' xlink:href='#g5-48' y='193.843'/>
  <use x='348.945' xlink:href='#g5-48' y='193.843'/>
  <use x='477.539' xlink:href='#g5-49' y='193.843'/>
  <use x='555.83' xlink:href='#g0-51' y='54.9332'/>
  <use x='555.83' xlink:href='#g0-55' y='98.5589'/>
  <use x='555.83' xlink:href='#g0-55' y='113.431'/>
  <use x='555.83' xlink:href='#g0-55' y='128.304'/>
  <use x='555.83' xlink:href='#g0-55' y='143.176'/>
  <use x='555.83' xlink:href='#g0-53' y='159.04'/>
  </g>
  </svg>
</p>
<p>矩阵对象<code>Matrix4</code>的方法<code>.makeOrthographic()</code>封装了正投影的算法，该方法用来创建一个正投影矩阵，在正投影相机对象<code>OrthographicCamera</code>中会调用该方法更新相机对象的投影矩阵属性<code>.projectionMatrix</code></p>
<p>方法参数：.makePerspective( left,right,top,bottom,near,far)</p>
<h3 id="-orthographiccamera-">正投影相机<code>OrthographicCamera</code></h3>
<p>正投影相机<code>OrthographicCamera</code>类封装调用了矩阵对象<code>Matrix4</code>的正投影矩阵变换方法<code>.makeOrthographic()</code>。执行该方法用来改变正投影相机对象的投影矩阵属性<code>.projectionMatrix</code>。</p>
<pre><code class="lang-JavaScript"><span class="hljs-comment">// OrthographicCamera.js源码</span>
<span class="hljs-keyword">this</span>.projectionMatrix.makeOrthographic( left, right, top, bottom, <span class="hljs-keyword">this</span>.near, <span class="hljs-keyword">this</span>.far )
</code></pre>
<p>构造函数<code>PerspectiveCamera(left,right,top,bottom,near,far)</code></p>
<p>正投影相机设置例子</p>
<pre><code class="lang-JavaScript">var width = window.innerWidth; <span class="hljs-comment">//窗口宽度</span>
var height = window.innerHeight; <span class="hljs-comment">//窗口高度</span>
var <span class="hljs-keyword">k</span> = width / height; <span class="hljs-comment">//窗口宽高比</span>
var <span class="hljs-keyword">s</span> = <span class="hljs-number">150</span>; <span class="hljs-comment">//三维场景显示范围控制系数，系数越大，显示的范围越大</span>
<span class="hljs-comment">//创建相机对象</span>
var camera = <span class="hljs-keyword">new</span> THREE.OrthographicCamera(-<span class="hljs-keyword">s</span> * <span class="hljs-keyword">k</span>, <span class="hljs-keyword">s</span> * <span class="hljs-keyword">k</span>, <span class="hljs-keyword">s</span>, -<span class="hljs-keyword">s</span>, <span class="hljs-number">1</span>, <span class="hljs-number">1000</span>);
camera.position.<span class="hljs-keyword">set</span>(<span class="hljs-number">200</span>, <span class="hljs-number">300</span>, <span class="hljs-number">200</span>); <span class="hljs-comment">//设置相机位置</span>
camera.lookAt(scene.position); <span class="hljs-comment">//设置相机方向(指向的场景对象)</span>
</code></pre>
<h3 id="-matrix4-makeperspective-"><code>Matrix4</code>方法：透视投影矩阵<code>.makePerspective()</code></h3>
<p>透视投影公式：</p>
<p>
  <?xml version='1.0' encoding='UTF-8'?>
  <!-- This file was generated by dvisvgm 1.15.1 -->
  <svg height='151.064pt' version='1.1' viewBox='-0.239051 -0.236057 455.787 151.064' width='455.787pt' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'>
  <defs>
  <path d='M8.08058 43.6252H9.79089V0.743612H16.3347V-0.966695H8.08058V43.6252Z' id='g0-50'/>
  <path d='M6.71729 43.6252H8.4276V-0.966695H0.173509V0.743612H6.71729V43.6252Z' id='g0-51'/>
  <path d='M8.08058 43.6004H16.3347V41.8901H9.79089V-0.991482H8.08058V43.6004Z' id='g0-52'/>
  <path d='M6.71729 41.8901H0.173509V43.6004H8.4276V-0.991482H6.71729V41.8901Z' id='g0-53'/>
  <path d='M8.08058 14.897H9.79089V-0.0247871H8.08058V14.897Z' id='g0-54'/>
  <path d='M6.71729 14.897H8.4276V-0.0247871H6.71729V14.897Z' id='g0-55'/>
  <use id='g2-0' transform='scale(1.19961)' xlink:href='#g1-0'/>
  <use id='g5-48' transform='scale(1.19961)' xlink:href='#g4-48'/>
  <use id='g5-49' transform='scale(1.19961)' xlink:href='#g4-49'/>
  <path d='M6.21942 -2.45884C6.11611 -2.10758 6.11611 -2.06625 5.82683 -1.67366C5.37226 -1.09511 4.4631 -0.206625 3.49197 -0.206625C2.6448 -0.206625 2.16956 -0.971138 2.16956 -2.19023C2.16956 -3.32667 2.8101 -5.64087 3.20269 -6.50869C3.90522 -7.95507 4.87635 -8.69892 5.68219 -8.69892C7.04592 -8.69892 7.31453 -7.00459 7.31453 -6.83929C7.31453 -6.81863 7.25254 -6.55002 7.23188 -6.50869L6.21942 -2.45884ZM7.54182 -7.74845C7.31453 -8.28567 6.75664 -9.11217 5.68219 -9.11217C3.34733 -9.11217 0.826501 -6.09544 0.826501 -3.03739C0.826501 -0.991801 2.02493 0.206625 3.42998 0.206625C4.56642 0.206625 5.53756 -0.681863 6.11611 -1.36373C6.32273 -0.144638 7.29387 0.206625 7.91375 0.206625S9.02952 -0.1653 9.40145 -0.909151C9.73205 -1.61168 10.0213 -2.87209 10.0213 -2.95474C10.0213 -3.05805 9.93867 -3.1407 9.8147 -3.1407C9.62873 -3.1407 9.60807 -3.03739 9.52542 -2.72745C9.21548 -1.50836 8.8229 -0.206625 7.97573 -0.206625C7.37652 -0.206625 7.33519 -0.743851 7.33519 -1.1571C7.33519 -1.63234 7.39718 -1.85963 7.58315 -2.66547C7.72778 -3.18203 7.8311 -3.6366 7.9964 -4.23582C8.76091 -7.33519 8.94687 -8.07905 8.94687 -8.20302C8.94687 -8.4923 8.71958 -8.71958 8.40965 -8.71958C7.74845 -8.71958 7.58315 -7.9964 7.54182 -7.74845Z' id='g3-97'/>
  <path d='M3.69859 -4.7937C4.25648 -4.7937 5.66153 -4.83503 6.65333 -5.20696C8.22368 -5.80617 8.36832 -7.00459 8.36832 -7.37652C8.36832 -8.28567 7.58315 -9.11217 6.21942 -9.11217C4.04985 -9.11217 0.929813 -7.14923 0.929813 -3.4713C0.929813 -1.30174 2.16956 0.206625 4.04985 0.206625C6.85996 0.206625 8.63693 -1.9836 8.63693 -2.25221C8.63693 -2.37619 8.51296 -2.4795 8.43031 -2.4795C8.36832 -2.4795 8.34766 -2.45884 8.1617 -2.27288C6.83929 -0.516563 4.87635 -0.206625 4.09118 -0.206625C2.91342 -0.206625 2.29354 -1.13644 2.29354 -2.66547C2.29354 -2.95474 2.29354 -3.4713 2.60348 -4.7937H3.69859ZM2.70679 -5.20696C3.59528 -8.38898 5.55822 -8.69892 6.21942 -8.69892C7.12857 -8.69892 7.74845 -8.1617 7.74845 -7.37652C7.74845 -5.20696 4.44244 -5.20696 3.57462 -5.20696H2.70679Z' id='g3-101'/>
  <path d='M9.21548 -8.30633C9.62873 -8.30633 9.79403 -8.30633 9.79403 -8.69892C9.79403 -8.90555 9.62873 -8.90555 9.25681 -8.90555H7.58315C7.97573 -11.0338 8.26501 -12.5008 8.43031 -13.162C8.55428 -13.6579 8.9882 -14.1332 9.52542 -14.1332C9.95934 -14.1332 10.3932 -13.9472 10.5999 -13.7612C9.79403 -13.6786 9.54608 -13.0794 9.54608 -12.7281C9.54608 -12.3149 9.85602 -12.0669 10.2486 -12.0669C10.6619 -12.0669 11.2817 -12.4182 11.2817 -13.2034C11.2817 -14.0712 10.4139 -14.5464 9.50476 -14.5464C8.61627 -14.5464 7.74845 -13.8852 7.33519 -13.0794C6.96327 -12.3562 6.75664 -11.6123 6.28141 -8.90555h3.89702C4.50443 -8.90555 4.2978 -8.90555 4.2978 -8.53362C4.2978 -8.30633 4.42178 -8.30633 4.83503 -8.30633H6.15743C5.78551 -6.38472 4.93834 -1.71499 4.4631 0.495901C4.11184 2.29354 3.8019 3.8019 2.76878 3.8019C2.70679 3.8019 2.10758 3.8019 1.73565 3.40932C2.78944 3.32667 2.78944 2.41751 2.78944 2.39685C2.78944 1.9836 2.4795 1.73565 2.08691 1.73565C1.67366 1.73565 1.05379 2.08691 1.05379 2.87209C1.05379 3.76058 1.96294 4.21515 2.76878 4.21515C4.87635 4.21515 5.74418 0.433913 5.97147 -0.599213C6.34339 -2.19023 7.35586 -7.68646 7.45917 -8.30633H9.21548Z' id='g3-102'/>
  <path d='M6.98393 -2.62414C6.90128 -2.29354 6.85996 -2.21089 6.59134 -1.90095C5.74418 -0.805838 4.87635 -0.41325 4.23582 -0.41325C3.55395 -0.41325 2.91342 -0.950476 2.91342 -2.37619C2.91342 -3.4713 3.53329 -5.78551 3.98787 -6.71532C4.58708 -7.87242 5.51689 -8.69892 6.38472 -8.69892C7.74845 -8.69892 8.01706 -7.00459 8.01706 -6.88062L7.95507 -6.59134L6.98393 -2.62414ZM8.26501 -7.74845C7.9964 -8.34766 7.41785 -9.11217 6.38472 -9.11217C4.1325 -9.11217 1.57035 -6.28141 1.57035 -3.20269C1.57035 -1.05379 2.87209 0 4.19449 0C5.28961 0 6.26074 -0.867826 6.63267 -1.28108L6.17809 0.578551C5.88882 1.71499 5.76484 2.23155 5.02099 2.95474C4.17383 3.8019 3.38865 3.8019 2.93408 3.8019C2.3142 3.8019 1.79764 3.76058 1.28108 3.59528C1.94228 3.40932 2.10758 2.83077 2.10758 2.60348C2.10758 2.27288 1.85963 1.94228 1.40505 1.94228C0.909151 1.94228 0.371925 2.35553 0.371925 3.03739C0.371925 3.88455 1.21909 4.21515 2.9754 4.21515C5.64087 4.21515 7.02526 2.50017 7.29387 1.38439L9.58741 -7.87242C9.6494 -8.12037 9.6494 -8.1617 9.6494 -8.20302C9.6494 -8.4923 9.42211 -8.71958 9.11217 -8.71958C8.61627 -8.71958 8.327 -8.30633 8.26501 -7.74845Z' id='g3-103'/>
  <path d='M5.80617 -13.8232C5.82683 -13.9059 5.86816 -14.0299 5.86816 -14.1332C5.86816 -14.3398 5.66153 -14.3398 5.62021 -14.3398C5.59954 -14.3398 4.58708 -14.2571 4.48377 -14.2365C4.1325 -14.2158 3.82257 -14.1745 3.45064 -14.1538C2.93408 -14.1125 2.78944 -14.0918 2.78944 -13.7199C2.78944 -13.5133 2.95474 -13.5133 3.24402 -13.5133C4.25648 -13.5133 4.27714 -13.3273 4.27714 -13.1207C4.27714 -12.9967 4.23582 -12.8314 4.21515 -12.7694L1.21909 -0.805838C1.13644 -0.495901 1.13644 -0.454575 1.13644 -0.3306C1.13644 0.123975 1.4877 0.206625 1.69433 0.206625C2.04559 0.206625 2.3142 -0.0619876 2.41751 -0.289275L3.34733 -4.02919C3.45064 -4.48377 3.57462 -4.91768 3.67793 -5.37226C3.90522 -6.24008 3.90522 -6.26074 4.2978 -6.85996S5.62021 -8.69892 7.21122 -8.69892C8.03772 -8.69892 8.327 -8.07905 8.327 -7.25254C8.327 -6.09544 7.52116 -3.84323 7.06658 -2.60348C6.88062 -2.10758 6.77731 -1.83896 6.77731 -1.46704C6.77731 -0.537226 7.41785 0.206625 8.40965 0.206625C10.3313 0.206625 11.0544 -2.83077 11.0544 -2.95474C11.0544 -3.05805 10.9718 -3.1407 10.8478 -3.1407C10.6619 -3.1407 10.6412 -3.07872 10.5379 -2.72745C10.0626 -1.07445 9.29813 -0.206625 8.47163 -0.206625C8.26501 -0.206625 7.93441 -0.227288 7.93441 -0.888488C7.93441 -1.42571 8.18236 -2.08691 8.26501 -2.3142C8.63693 -3.306 9.56675 -5.74418 9.56675 -6.94261C9.56675 -8.18236 8.84356 -9.11217 7.27321 -9.11217C6.09544 -9.11217 5.06232 -8.55428 4.21515 -7.47983L5.80617 -13.8232Z' id='g3-104'/>
  <path d='M5.84749 -2.95474C5.84749 -3.05805 5.76484 -3.1407 5.64087 -3.1407C5.45491 -3.1407 5.43424 -3.07872 5.33093 -2.72745C4.7937 -0.847163 3.94654 -0.206625 3.26468 -0.206625C3.01673 -0.206625 2.72745 -0.268613 2.72745 -0.888488C2.72745 -1.44638 2.9754 -2.06625 3.20269 -2.68613L4.64907 -6.52936C4.71105 -6.69466 4.85569 -7.06658 4.85569 -7.45917C4.85569 -8.327 4.23582 -9.11217 3.22335 -9.11217C1.3224 -9.11217 0.557888 -6.11611 0.557888 -5.95081C0.557888 -5.86816 0.640538 -5.76484 0.785176 -5.76484C0.971138 -5.76484 0.991801 -5.84749 1.07445 -6.13677C1.57035 -7.87242 2.35553 -8.69892 3.16137 -8.69892C3.34733 -8.69892 3.69859 -8.67826 3.69859 -8.01706C3.69859 -7.47983 3.42998 -6.79797 3.26468 -6.34339L1.8183 -2.50017C1.69433 -2.16956 1.57035 -1.83896 1.57035 -1.46704C1.57035 -0.537226 2.21089 0.206625 3.20269 0.206625C5.10364 0.206625 5.84749 -2.8101 5.84749 -2.95474ZM5.68219 -12.8934C5.68219 -13.2034 5.43424 -13.5753 4.97967 -13.5753C4.50443 -13.5753 3.9672 -13.1207 3.9672 -12.5835C3.9672 -12.0669 4.40112 -11.9016 4.64907 -11.9016C5.20696 -11.9016 5.68219 -12.4388 5.68219 -12.8934Z' id='g3-105'/>
  <path d='M4.25648 -6.05412C4.2978 -6.17809 4.81437 -7.21122 5.57888 -7.87242C6.11611 -8.36832 6.81863 -8.69892 7.62447 -8.69892C8.45097 -8.69892 8.74025 -8.07905 8.74025 -7.25254C8.74025 -6.07478 7.89308 -3.71925 7.47983 -2.60348C7.29387 -2.10758 7.19056 -1.83896 7.19056 -1.46704C7.19056 -0.537226 7.8311 0.206625 8.8229 0.206625C10.7445 0.206625 11.4677 -2.83077 11.4677 -2.95474C11.4677 -3.05805 11.385 -3.1407 11.2611 -3.1407C11.0751 -3.1407 11.0544 -3.07872 10.9511 -2.72745C10.4759 -1.03313 9.69072 -0.206625 8.88488 -0.206625C8.67826 -0.206625 8.34766 -0.227288 8.34766 -0.888488C8.34766 -1.40505 8.57495 -2.02493 8.69892 -2.3142C9.11217 -3.45064 9.98 -5.76484 9.98 -6.94261C9.98 -8.18236 9.25681 -9.11217 7.68646 -9.11217C5.84749 -9.11217 4.87635 -7.81043 4.50443 -7.29387C4.44244 -8.47163 3.59528 -9.11217 2.68613 -9.11217C2.02493 -9.11217 1.57035 -8.71958 1.21909 -8.01706C0.847163 -7.27321 0.557888 -6.03346 0.557888 -5.95081S0.640538 -5.76484 0.785176 -5.76484C0.950476 -5.76484 0.971138 -5.78551 1.09511 -6.26074C1.42571 -7.52116 1.79764 -8.69892 2.62414 -8.69892C3.09938 -8.69892 3.26468 -8.36832 3.26468 -7.74845C3.26468 -7.29387 3.05805 -6.48803 2.91342 -5.84749L2.33486 -3.61594C2.25221 -3.22335 2.02493 -2.29354 1.92161 -1.92161C1.77698 -1.38439 1.54969 -0.41325 1.54969 -0.309938C1.54969 -0.0206625 1.77698 0.206625 2.08691 0.206625C2.33486 0.206625 2.62414 0.0826501 2.78944 -0.227288C2.83077 -0.3306 3.01673 -1.05379 3.12004 -1.46704L3.57462 -3.32667L4.25648 -6.05412Z' id='g3-110'/>
  <path d='M9.42211 -5.68219C9.42211 -7.64513 8.14103 -9.11217 6.26074 -9.11217C3.53329 -9.11217 0.847163 -6.13677 0.847163 -3.22335C0.847163 -1.26041 2.12824 0.206625 4.00853 0.206625C6.75664 0.206625 9.42211 -2.76878 9.42211 -5.68219ZM4.02919 -0.206625C2.99607 -0.206625 2.23155 -1.03313 2.23155 -2.4795C2.23155 -3.42998 2.72745 -5.53756 3.306 -6.57068C4.23582 -8.1617 5.39292 -8.69892 6.24008 -8.69892C7.25254 -8.69892 8.03772 -7.87242 8.03772 -6.42604C8.03772 -5.59954 7.60381 -3.38865 6.81863 -2.12824C5.97147 -0.743851 4.83503 -0.206625 4.02919 -0.206625Z' id='g3-111'/>
  <path d='M0.888488 2.62414C0.743851 3.24402 0.661201 3.40932 -0.185963 3.40932C-0.433913 3.40932 -0.640538 3.40932 -0.640538 3.8019C-0.640538 3.84323 -0.619876 4.00853 -0.392588 4.00853C-0.123975 4.00853 0.1653 3.9672 0.433913 3.9672H1.3224C1.75631 3.9672 2.8101 4.00853 3.24402 4.00853C3.36799 4.00853 3.61594 4.00853 3.61594 3.6366C3.61594 3.40932 3.4713 3.40932 3.12004 3.40932C2.16956 3.40932 2.10758 3.26468 2.10758 3.09938C2.10758 2.85143 3.03739 -0.702526 3.16137 -1.17776C3.38865 -0.599213 3.94654 0.206625 5.02099 0.206625C7.35586 0.206625 9.87669 -2.83077 9.87669 -5.86816C9.87669 -7.76911 8.80223 -9.11217 7.25254 -9.11217C5.93014 -9.11217 4.81437 -7.8311 4.58708 -7.54182C4.42178 -8.57495 3.61594 -9.11217 2.78944 -9.11217C2.19023 -9.11217 1.71499 -8.8229 1.3224 -8.03772C0.950476 -7.29387 0.661201 -6.03346 0.661201 -5.95081S0.743851 -5.76484 0.888488 -5.76484C1.05379 -5.76484 1.07445 -5.78551 1.19843 -6.26074C1.50836 -7.47983 1.90095 -8.69892 2.72745 -8.69892C3.20269 -8.69892 3.36799 -8.36832 3.36799 -7.74845C3.36799 -7.25254 3.306 -7.04592 3.22335 -6.67399L0.888488 2.62414ZM4.4631 -6.44671C4.60774 -7.02526 5.18629 -7.62447 5.51689 -7.91375C5.74418 -8.12037 6.42604 -8.69892 7.21122 -8.69892C8.12037 -8.69892 8.53362 -7.78977 8.53362 -6.71532C8.53362 -5.72352 7.95507 -3.38865 7.43851 -2.3142C6.92194 -1.19843 5.97147 -0.206625 5.02099 -0.206625C3.61594 -0.206625 3.38865 -1.9836 3.38865 -2.06625C3.38865 -2.12824 3.42998 -2.29354 3.45064 -2.39685L4.4631 -6.44671Z' id='g3-112'/>
  <path d='M8.03772 -8.45097C7.39718 -8.327 7.06658 -7.87242 7.06658 -7.41785C7.06658 -6.92194 7.45917 -6.75664 7.74845 -6.75664C8.327 -6.75664 8.80223 -7.25254 8.80223 -7.87242C8.80223 -8.53362 8.1617 -9.11217 7.12857 -9.11217C6.30207 -9.11217 5.35159 -8.74025 4.48377 -7.47983C4.33913 -8.57495 3.51263 -9.11217 2.68613 -9.11217C1.88029 -9.11217 1.46704 -8.4923 1.21909 -8.03772C0.867826 -7.29387 0.557888 -6.05412 0.557888 -5.95081C0.557888 -5.86816 0.640538 -5.76484 0.785176 -5.76484C0.950476 -5.76484 0.971138 -5.78551 1.09511 -6.26074C1.40505 -7.5005 1.79764 -8.69892 2.62414 -8.69892C3.12004 -8.69892 3.26468 -8.34766 3.26468 -7.74845C3.26468 -7.29387 3.05805 -6.48803 2.91342 -5.84749L2.33486 -3.61594C2.25221 -3.22335 2.02493 -2.29354 1.92161 -1.92161C1.77698 -1.38439 1.54969 -0.41325 1.54969 -0.309938C1.54969 -0.0206625 1.77698 0.206625 2.08691 0.206625C2.3142 0.206625 2.70679 0.0619876 2.83077 -0.351263C2.89275 -0.516563 3.65727 -3.6366 3.78124 -4.11184C3.88455 -4.56642 4.00853 -5.00033 4.11184 -5.45491C4.19449 -5.74418 4.27714 -6.07478 4.33913 -6.34339C4.40112 -6.52936 4.95901 -7.54182 5.47557 -7.9964C5.72352 -8.22368 6.26074 -8.69892 7.10791 -8.69892C7.43851 -8.69892 7.76911 -8.63693 8.03772 -8.45097Z' id='g3-114'/>
  <path d='M4.15317 -8.30633H6.05412C6.44671 -8.30633 6.65333 -8.30633 6.65333 -8.67826C6.65333 -8.90555 6.52936 -8.90555 6.11611 -8.90555h3.2978L5.06232 -11.9223C5.14497 -12.2115 5.14497 -12.2529 5.14497 -12.3975C5.14497 -12.7281 4.87635 -12.9141 4.60774 -12.9141C4.44244 -12.9141 3.9672 -12.8521 3.8019 -12.1909L2.99607 -8.90555H1.05379C0.640538 -8.90555 0.454575 -8.90555 0.454575 -8.51296C0.454575 -8.30633 0.599213 -8.30633 0.991801 -8.30633H2.83077L1.46704 -2.85143C1.30174 -2.12824 1.23975 -1.92161 1.23975 -1.653C1.23975 -0.681863 1.92161 0.206625 3.07872 0.206625C5.16563 0.206625 6.28141 -2.8101 6.28141 -2.95474C6.28141 -3.07872 6.19876 -3.1407 6.07478 -3.1407C6.03346 -3.1407 5.95081 -3.1407 5.90948 -3.05805C5.88882 -3.03739 5.86816 -3.01673 5.72352 -2.68613C5.28961 -1.653 4.33913 -0.206625 3.1407 -0.206625C2.52083 -0.206625 2.4795 -0.723188 2.4795 -1.17776C2.4795 -1.19843 2.4795 -1.59101 2.54149 -1.83896L4.15317 -8.30633Z' id='g3-116'/>
  <path d='M7.78977 -4.7937H13.2653C13.5546 -4.7937 13.9059 -4.7937 13.9059 -5.14497C13.9059 -5.51689 13.5753 -5.51689 13.2653 -5.51689H7.78977V-10.9925C7.78977 -11.2817 7.78977 -11.633 7.43851 -11.633C7.06658 -11.633 7.06658 -11.3024 7.06658 -10.9925V-5.51689H1.59101C1.30174 -5.51689 0.950476 -5.51689 0.950476 -5.16563C0.950476 -4.7937 1.28108 -4.7937 1.59101 -4.7937H7.06658V0.681863C7.06658 0.971138 7.06658 1.3224 7.41785 1.3224C7.78977 1.3224 7.78977 0.991801 7.78977 0.681863V-4.7937Z' id='g4-43'/>
  <path d='M8.67826 -6.63267C8.67826 -7.89308 8.6576 -10.042 7.78977 -11.695C7.02526 -13.1414 5.80617 -13.6579 4.73172 -13.6579C3.73992 -13.6579 2.4795 -13.2034 1.69433 -11.7156C0.867826 -10.166 0.785176 -8.24435 0.785176 -6.63267C0.785176 -5.45491 0.805838 -3.65727 1.44638 -2.08691C2.33486 0.041325 3.92588 0.3306 4.73172 0.3306C5.68219 0.3306 7.12857 -0.0619876 7.97573 -2.02493C8.59561 -3.45064 8.67826 -5.12431 8.67826 -6.63267ZM4.73172 0C3.40932 0 2.62414 -1.13644 2.33486 -2.70679C2.10758 -3.92588 2.10758 -5.70286 2.10758 -6.85996C2.10758 -8.45097 2.10758 -9.77337 2.37619 -11.0338C2.76878 -12.7901 3.92588 -13.3273 4.73172 -13.3273C5.57888 -13.3273 6.67399 -12.7694 7.06658 -11.0751C7.33519 -9.89735 7.35586 -8.51296 7.35586 -6.85996C7.35586 -5.51689 7.35586 -3.86389 7.10791 -2.6448C6.67399 -0.392588 5.45491 0 4.73172 0Z' id='g4-48'/>
  <path d='M5.49623 -13.2034C5.49623 -13.6373 5.47557 -13.6579 5.18629 -13.6579C4.38045 -12.6868 3.16137 -12.3769 2.00426 -12.3355C1.94228 -12.3355 1.83896 -12.3355 1.8183 -12.2942S1.79764 -12.2115 1.79764 -11.7776C2.43818 -11.7776 3.51263 -11.9016 4.33913 -12.3975V-1.50836C4.33913 -0.785176 4.2978 -0.537226 2.52083 -0.537226H1.90095V0C2.89275 -0.0206625 3.92588 -0.041325 4.91768 -0.041325S6.94261 -0.0206625 7.93441 0V-0.537226H7.31453C5.53756 -0.537226 5.49623 -0.764513 5.49623 -1.50836V-13.2034Z' id='g4-49'/>
  <path d='M8.61627 -3.20269H8.24435C8.03772 -1.73565 7.87242 -1.4877 7.78977 -1.36373C7.68646 -1.19843 6.19876 -1.19843 5.90948 -1.19843H1.94228C2.68613 -2.00426 4.1325 -3.4713 5.88882 -5.16563C7.14923 -6.36406 8.61627 -7.76911 8.61627 -9.8147C8.61627 -12.2529 6.67399 -13.6579 4.50443 -13.6579C2.23155 -13.6579 0.847163 -11.6537 0.847163 -9.79403C0.847163 -8.9882 1.44638 -8.88488 1.69433 -8.88488C1.90095 -8.88488 2.52083 -9.00886 2.52083 -9.73205C2.52083 -10.3726 1.9836 -10.5585 1.69433 -10.5585C1.57035 -10.5585 1.44638 -10.5379 1.36373 -10.4966C1.75631 -12.2529 2.95474 -13.1207 4.21515 -13.1207C6.01279 -13.1207 7.19056 -11.695 7.19056 -9.8147C7.19056 -8.01706 6.13677 -6.46737 4.95901 -5.12431L0.847163 -0.475238V0H8.12037L8.61627 -3.20269Z' id='g4-50'/>
  <path d='M13.6166 -4.75238C13.9679 -4.75238 14.3398 -4.75238 14.3398 -5.16563S13.9679 -5.57888 13.6166 -5.57888H2.43818C2.08691 -5.57888 1.71499 -5.57888 1.71499 -5.16563S2.08691 -4.75238 2.43818 -4.75238H13.6166Z' id='g1-0'/>
  <path d='M5.68219 -8.8229C5.70286 -9.11217 5.70286 -9.60807 5.16563 -9.60807C4.83503 -9.60807 4.56642 -9.33946 4.6284 -9.07085V-8.80223L4.91768 -5.59954L2.27288 -7.52116C2.08691 -7.62447 2.04559 -7.6658 1.90095 -7.6658C1.61168 -7.6658 1.34306 -7.37652 1.34306 -7.08724C1.34306 -6.75664 1.54969 -6.67399 1.75631 -6.57068L4.69039 -5.16563L1.83896 -3.78124C1.50836 -3.61594 1.34306 -3.53329 1.34306 -3.22335S1.61168 -2.6448 1.90095 -2.6448C2.04559 -2.6448 2.08691 -2.6448 2.60348 -3.03739L4.91768 -4.71105L4.60774 -1.23975C4.60774 -0.805838 4.97967 -0.702526 5.14497 -0.702526C5.39292 -0.702526 5.70286 -0.847163 5.70286 -1.23975L5.39292 -4.71105L8.03772 -2.78944C8.22368 -2.68613 8.26501 -2.6448 8.40965 -2.6448C8.69892 -2.6448 8.96753 -2.93408 8.96753 -3.22335C8.96753 -3.53329 8.78157 -3.6366 8.53362 -3.76058C7.29387 -4.38045 7.25254 -4.38045 5.62021 -5.14497L8.47163 -6.52936C8.80223 -6.69466 8.96753 -6.77731 8.96753 -7.08724S8.69892 -7.6658 8.40965 -7.6658C8.26501 -7.6658 8.22368 -7.6658 7.70712 -7.27321L5.39292 -5.59954L5.68219 -8.8229Z' id='g1-3'/>
  </defs>
  <g id='page1' transform='matrix(1.13 0 0 1.13 -63.986 -63.1846)'>
  <use x='56.4133' xlink:href='#g0-50' y='56.6944'/>
  <use x='56.4133' xlink:href='#g0-54' y='100.32'/>
  <use x='56.4133' xlink:href='#g0-54' y='115.192'/>
  <use x='56.4133' xlink:href='#g0-54' y='130.065'/>
  <use x='56.4133' xlink:href='#g0-52' y='145.929'/>
  <use x='76.2381' xlink:href='#g3-110' y='64.9603'/>
  <use x='88.2699' xlink:href='#g3-101' y='64.9603'/>
  <use x='97.6119' xlink:href='#g3-97' y='64.9603'/>
  <use x='108.193' xlink:href='#g3-114' y='64.9603'/>
  <rect height='0.991445' width='45.963' x='74.1335' y='68.0272'/>
  <use x='74.1335' xlink:href='#g3-114' y='84.3591'/>
  <use x='83.779' xlink:href='#g3-105' y='84.3591'/>
  <use x='90.6552' xlink:href='#g3-103' y='84.3591'/>
  <use x='101.048' xlink:href='#g3-104' y='84.3591'/>
  <use x='112.651' xlink:href='#g3-116' y='84.3591'/>
  <use x='147.643' xlink:href='#g5-48' y='74.7197'/>
  <use x='235.665' xlink:href='#g5-48' y='74.7197'/>
  <use x='364.635' xlink:href='#g5-48' y='74.7197'/>
  <use x='91.4312' xlink:href='#g5-48' y='109.298'/>
  <use x='132.45' xlink:href='#g3-110' y='99.5388'/>
  <use x='144.482' xlink:href='#g3-101' y='99.5388'/>
  <use x='153.824' xlink:href='#g3-97' y='99.5388'/>
  <use x='164.405' xlink:href='#g3-114' y='99.5388'/>
  <rect height='0.991445' width='41.7539' x='132.45' y='102.606'/>
  <use x='139.734' xlink:href='#g3-116' y='117.846'/>
  <use x='147.013' xlink:href='#g3-111' y='117.846'/>
  <use x='156.702' xlink:href='#g3-112' y='117.846'/>
  <use x='235.665' xlink:href='#g5-48' y='109.298'/>
  <use x='364.635' xlink:href='#g5-48' y='109.298'/>
  <use x='91.4312' xlink:href='#g5-48' y='147.914'/>
  <use x='147.643' xlink:href='#g5-48' y='147.914'/>
  <use x='185.362' xlink:href='#g2-0' y='147.914'/>
  <use x='206.363' xlink:href='#g3-102' y='136.212'/>
  <use x='218.505' xlink:href='#g3-97' y='136.212'/>
  <use x='229.085' xlink:href='#g3-114' y='136.212'/>
  <use x='238.731' xlink:href='#g4-43' y='136.212'/>
  <use x='253.549' xlink:href='#g3-110' y='136.212'/>
  <use x='265.581' xlink:href='#g3-101' y='136.212'/>
  <use x='274.923' xlink:href='#g3-97' y='136.212'/>
  <use x='285.504' xlink:href='#g3-114' y='136.212'/>
  <rect height='0.991445' width='90.3033' x='205.765' y='141.222'/>
  <use x='205.765' xlink:href='#g3-102' y='157.553'/>
  <use x='217.906' xlink:href='#g3-97' y='157.553'/>
  <use x='228.487' xlink:href='#g3-114' y='157.553'/>
  <use x='238.132' xlink:href='#g1-0' y='157.553'/>
  <use x='254.143' xlink:href='#g3-110' y='157.553'/>
  <use x='266.175' xlink:href='#g3-101' y='157.553'/>
  <use x='275.517' xlink:href='#g3-97' y='157.553'/>
  <use x='286.098' xlink:href='#g3-114' y='157.553'/>
  <use x='307.298' xlink:href='#g2-0' y='147.914'/>
  <use x='327.701' xlink:href='#g4-50' y='136.212'/>
  <use x='337.141' xlink:href='#g1-3' y='136.212'/>
  <use x='347.434' xlink:href='#g3-102' y='136.212'/>
  <use x='359.575' xlink:href='#g3-97' y='136.212'/>
  <use x='370.156' xlink:href='#g3-114' y='136.212'/>
  <use x='379.802' xlink:href='#g1-3' y='136.212'/>
  <use x='390.094' xlink:href='#g3-110' y='136.212'/>
  <use x='402.126' xlink:href='#g3-101' y='136.212'/>
  <use x='411.468' xlink:href='#g3-97' y='136.212'/>
  <use x='422.049' xlink:href='#g3-114' y='136.212'/>
  <rect height='0.991445' width='104.371' x='327.701' y='141.222'/>
  <use x='334.734' xlink:href='#g3-102' y='157.553'/>
  <use x='346.876' xlink:href='#g3-97' y='157.553'/>
  <use x='357.457' xlink:href='#g3-114' y='157.553'/>
  <use x='367.102' xlink:href='#g1-0' y='157.553'/>
  <use x='383.113' xlink:href='#g3-110' y='157.553'/>
  <use x='395.145' xlink:href='#g3-101' y='157.553'/>
  <use x='404.487' xlink:href='#g3-97' y='157.553'/>
  <use x='415.067' xlink:href='#g3-114' y='157.553'/>
  <use x='91.4312' xlink:href='#g5-48' y='182.493'/>
  <use x='147.643' xlink:href='#g5-48' y='182.493'/>
  <use x='226.026' xlink:href='#g2-0' y='182.493'/>
  <use x='245.232' xlink:href='#g5-49' y='182.493'/>
  <use x='364.635' xlink:href='#g5-48' y='182.493'/>
  <use x='443.302' xlink:href='#g0-51' y='56.6944'/>
  <use x='443.302' xlink:href='#g0-55' y='100.32'/>
  <use x='443.302' xlink:href='#g0-55' y='115.192'/>
  <use x='443.302' xlink:href='#g0-55' y='130.065'/>
  <use x='443.302' xlink:href='#g0-53' y='145.929'/>
  </g>
  </svg>
</p>
<p>矩阵对象<code>Matrix4</code>的方法<code>.makePerspective()</code>封装了透视投影的算法，该方法用来创建一个透视投影矩阵，在透视投影相机对象<code>PerspectiveCamera</code>中会调用该方法更新相机对象的投影矩阵属性<code>.projectionMatrix</code>。</p>
<p>方法参数：.makePerspective( left,right,top,bottom,near,far)</p>
<h3 id="-perspectivecamera-">透视投影相机<code>PerspectiveCamera</code></h3>
<p>透视投影相机<code>PerspectiveCamera</code>类封装调用了矩阵对象<code>Matrix4</code>的透视投影矩阵变换方法<code>.makePerspective()</code>。执行该方法用来改变透视投影相机对象的投影矩阵属性<code>.projectionMatrix</code>。</p>
<pre><code class="lang-JavaScript"><span class="hljs-comment">// PerspectiveCamera.js源码</span>
<span class="hljs-keyword">this</span>.projectionMatrix.makePerspective(...);
</code></pre>
<p>构造函数<code>PerspectiveCamera(fov,aspect,near,far)</code></p>
<p>透视投影相机使用例子</p>
<pre><code class="lang-JavaScript"><span class="hljs-keyword">var</span> width = <span class="hljs-built_in">window</span>.innerWidth; <span class="hljs-comment">//窗口宽度</span>
<span class="hljs-keyword">var</span> height = <span class="hljs-built_in">window</span>.innerHeight; <span class="hljs-comment">//窗口高度</span>
<span class="hljs-comment">/**透视投影相机对象*/</span>
<span class="hljs-keyword">var</span> camera = <span class="hljs-keyword">new</span> THREE.PerspectiveCamera(<span class="hljs-number">60</span>, width / height, <span class="hljs-number">1</span>, <span class="hljs-number">1000</span>);
camera.position.set(<span class="hljs-number">200</span>, <span class="hljs-number">300</span>, <span class="hljs-number">200</span>); <span class="hljs-comment">//设置相机位置</span>
camera.lookAt(scene.position); <span class="hljs-comment">//设置相机方向(指向的场景对象)</span>
</code></pre>
<h3 id="-matrix4-lookat-"><code>Matrix4</code>方法：<code>.lookAt()</code></h3>
<p>矩阵对象<code>Matrix4</code>的<code>.lookAt()</code>方法对图形学中投影矩阵算法进行了封装，也就是通过给定的参数生成变换矩阵，视图矩阵和模型矩阵一样会用于场景中对象的平移旋转等变换，该方法通常用于构建相机对象的视图矩阵<code>.matrixWorldInverse</code>属性。</p>
<p>参数：<code>.lookAt(eye,center, up )</code></p>
<p>三个参数都是三维向量对象<code>Vector3</code>，eye是视点也就是观察位置，center表示被观察的位置，up表示向上的方向。</p>
<h3 id="-object3d-lookat-x-y-z-"><code>Object3D</code>方法<code>.lookAt(x,y,z)</code></h3>
<p><code>Object3D</code>类封装了矩阵对象<code>Matrix4</code>的<code>.lookAt()</code>方法，得到一个新的方法<code>.lookAt(x,y,z)</code>,参数表示xyz是相机的目标观察点。</p>
<p>通过<code>Object3D</code>对象的<code>.lookAt(x,y,z)</code>方法可以改变自身的四元数属性<code>.quaternion</code>,四元数属性<code>.quaternion</code>和对象角度属性<code>rotaion</code>一样表示对象的旋转变换，可以转化为旋转矩阵，进而改变对象的本地矩阵属性<code>.matrix</code>和世界矩阵属性<code>.matrixWorld</code>。</p>
<pre><code class="lang-JavaScript"><span class="hljs-comment">// Object3D.js源码</span>
<span class="hljs-comment">// `.lookAt()`方法计算得到的旋转矩阵对象m1改变对象的四元数属性.quaternion</span>
<span class="hljs-keyword">this</span>.quaternion.setFromRotationMatrix( m1 );
</code></pre>
<h3 id="-">相机对象</h3>
<p>透视投影相机<code>PerspectiveCamera</code>和正投影相机<code>OrthographicCamera</code>的基类是相机对象<code>Camera</code>，相机对象的基类是<code>Object3D</code>，所以相机对象会继承<code>Object3D</code>的<code>.lookAt(x,y,z)</code>方法，勇于改变自身的矩阵属性。</p>
<p><code>Object3D</code> → <code>Camera</code> → <code>PerspectiveCamera</code></p>
<p><code>Object3D</code> → <code>Camera</code> → <code>OrthographicCamera</code></p>
<p>相机对象的视图矩阵属性<code>matrixWorldInverse</code>，字面意思是世界矩阵逆矩阵的意思，这可以看书来相机对象的视图矩阵属性就是自身世界矩阵<code>matrixWorld</code>的逆矩阵。</p>
<p>设置相机对象的位置属性和lookAt方法本质就是改变自身的视图矩阵属性<code>matrixWorldInverse</code>。</p>
<pre><code class="lang-JavaScript"><span class="hljs-keyword">var</span> camera = <span class="hljs-keyword">new</span> THREE.OrthographicCamera(...);
<span class="hljs-comment">//设置相机位置</span>
camera.position.<span class="hljs-keyword">set</span>(<span class="hljs-number">200</span>, <span class="hljs-number">300</span>, <span class="hljs-number">200</span>);
<span class="hljs-comment">//设置相机对象的观察目标的位置</span>
camera.lookAt(scene.position);
</code></pre>
<div class="">
  <a href="http://www.yanhuangxueyuan.com/">作者技术博客</a>
</div>

  </body>
</html>
